import React from 'react'
import { NavBar,List } from 'antd-mobile';
import { useNavigate } from 'react-router-dom';
import { useState } from 'react';

export default function Settings() {
  let navigate = useNavigate()
  return (
    <div>
       <NavBar onBack={()=>{navigate(-1)}}>系统设置</NavBar>
       <div style={{background:"#f7f7f7",height:"calc(100vh - 45px)"}}>
        <List header=' '>
          <List.Item onClick={() => {navigate("/personalinformation")}}>
            个人资料
          </List.Item>
          <List.Item onClick={() => {navigate("/accountsecurity")}}>
            账号与安全
          </List.Item>
          <List.Item onClick={() => {navigate("/privacysettings")}}>
            隐私设置
          </List.Item>
        </List>
        <List header=' '>
          <List.Item onClick={() => {navigate("/messagesettings")}}>
            消息设置
          </List.Item>
          <List.Item onClick={() => {navigate("/runningsettings")}}>
            跑步设置
          </List.Item>
        </List>
        <List header=' '>
          <List.Item onClick={() => {navigate("/privacymanagement")}}>
            隐私管理
          </List.Item>
          <List.Item onClick={() => {navigate("/serviceagreement") }}>
            服务协议
          </List.Item>
          <List.Item onClick={() => {navigate("/aboutus")}}>
            关于我们
          </List.Item>
        </List>
        <div className='hs_exit' onClick={()=>{
          localStorage.removeItem("token")
          navigate("/login")
        }}>
          退出登录
        </div>
      </div>
    </div>
  )
}
